<extend name="../layout" />

<block name="main_content">
    <include file="Common:SettingsHeader:statistics_sale_region" />
    <div class="widget-box">
        <div class="widget-title"> <span class="icon"> <i class="icon-info-sign"></i> </span>
            <h5>{$chartTitle}</h5>
            <a href="{:U('index')}" class="label label-info">{:L('go_back')}</a>
        </div>
        <div class="widget-content nopadding">
            <div id="chartsContainer"></div>
        </div>
    </div>
</block>

<block name="footer_js">
    <script type="text/javascript">
        $(function() {
            var colors = Highcharts.getOptions().colors,
                categories = {$categories},
                data = {$data};
            for(i=0;i<data.length;i++) {
                data[i].color = colors[data[i].color];
            }
            displayCharts.displayBar('#chartsContainer','{$chartTitle}', {$categories}, null, data);
        });


    </script>
</block>